<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>淘淘商城-首页</title>
    <!--bootstrap-->
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="../js/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="../bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-xs-3" style="background-color: #f7e1b5">3个格子宽度</div>
    </div>
    <div class="row">
        <div class="col-xs-6 col-xs-offset-6" style="background-color: #f7e1b5">6个格子宽度</div>
    </div>
    <div class="row">
        <div class="col-xs-4 col-xs-offset-4" style="background-color: #f7e1b5">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-10 col-xs-offset-6" style="background-color: #bce8f1">
                        嵌套栅格
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12" style="background-color: #f7e1b5">12个格子宽度</div>
    </div>
</div>

</body>
</html>